<template>
	<!-- <view>
		文章详情
	</view> -->
	<view class="box">
		<view class="head">{{product.title}}</view>
		<view class="author">作者:{{product.author}}</view>
		<view class="time">时间:{{product.createTime}}</view>
		<view class="summary">概要描述:{{product.summary}}</view>
		<view class="content">
			<image :src="product.coverImg"></image>
		</view>
		<mp-html :content="product.content1" />
	</view>
</template>

<script>
	import {productArticle} from "../../../api/find/index.js";
	import mpHtml from '@/components/mp-html/mp-html';
	export default {
		components: {
		   mpHtml
		 },
		data() {	
			return {
				id:"",
				product:[],
			};
		},
		onLoad(res){
			console.log(res);
			this.id=res.id;
			// //文章详情
			productArticle(this.id).then(res=>{
				console.log(res)
				this.product=res.data.productArticle
			})

		}
	}
</script>

<style lang="scss" scoped>
.box{
	width: 100%;
	height: 100vh;
	background-color:#F1ECE7 ;
	view{
		padding:0 30px;
	}
	.head{
		width: 100%;
		padding-top: 30px;
		font-size: 25px;
		font-weight: bold;

	}
	.author{
		text-align: right;
		margin-top: 10px;
	}
	.time{
		text-align: right;
		margin-top: 10px;
	}
	.summary{
		margin-top: 10px;
	}
	.photo{
		margin-top: 20px;
		width: 100%;
	}
}
</style>
